<template>
  <el-menu-item v-if="!myRoute.children || myRoute.children.length === 0" :key="myRoute.name" :index="myRoute.path">


    <el-icon>
      <component :is="myRoute.meta.icon" v-if="myRoute.meta.icon"/>
    </el-icon>

    <span>{{ myRoute.meta.title }}</span>
  </el-menu-item>

  <el-sub-menu v-else :key="myRoute.name" :index="myRoute.path">
    <template #title>
      <!--      <el-icon :class="myRoute.meta.icon"></el-icon>-->
      <el-icon>
        <component :is="myRoute.meta.icon" v-if="myRoute.meta.icon"/>
      </el-icon>
      <span>{{ myRoute.meta.title }}</span>
    </template>
    <MenuItem v-for="child in myRoute.children" :key="child.name" :myRoute="child"/>
  </el-sub-menu>
</template>
<script setup lang="ts">

// 定义 Route 接口
interface RouteMeta {
  title: string;
  isShow: boolean;
  closable: boolean
}

interface myRouteI {
  path: string;
  meta: RouteMeta;
  children?: myRouteI[];
}

// 接收来自父组件传入的路由数据
defineProps<{
  myRoute: myRouteI;
}>();
// onMounted(
//     () => {
//       console.log("我的： " + props.myRoute)
//       props.myRoute?.forEach(item => {
//         console.log("我的children item title： " + item.meta.title)
//         console.log("我的children item path： " + item.path)
//         console.log("我的children item children： " + item.children)
//         console.log("=======================================================")
//       })
//     }
// )
// const getMyprops = () => {
//   console.log("我的： " + props.myRoute)
//   // console.log("我是有路由： " + hasChildren)
//   console.log("我的path： " + props.myRoute.path)
//   props.myRoute.children?.forEach(item => {
//     console.log("我的children item： " + item.meta.title)
//   })

// console.log("我的meta title： " + props.myRoute.meta.title)
// console.log("我的meta isShow ： " + props.myRoute.meta.isShow)
// console.log("我的meta closable ： " + props.myRoute.meta.closable)
// console.log("=======================================================")
// }
// 判断是否有子路由
// const hasChildren = props.myRoute.children && props.myRoute.children.length > 0;
</script>
